<template>
  <keep-alive>
    <component :is="currentComponent" :task="task" />
  </keep-alive>
</template>
<script>
import err from './err'
import loading from './loading'
export default {
  props: {
    form: {
      type: Object,
      default: () => {}
    },
    task: {
      type: Object,
      default: () => {}
    }
  },
  data: function() {
    return {
      currentComponent: {}
    }
  },
  created() {
    this.createComponent()
  },
  methods: {
    createComponent: function() {
      // const self = this
      const path = this.form.linkpath
      const AsyncComponent = () => ({
        // 需要加载的组件 (应该是一个 `Promise` 对象)
        component: new Promise(resolve => require.ensure([], () => resolve(require('@/' + path + '.vue')))),
        // 异步组件加载时使用的组件
        loading: loading,
        // 加载失败时使用的组件
        error: err,
        // 展示加载时组件的延时时间。默认值是 200 (毫秒)
        delay: 200,
        // 如果提供了超时时间且组件加载也超时了，
        // 则使用加载失败时使用的组件。默认值是：`Infinity`
        timeout: 3000
      })
      this.currentComponent = AsyncComponent
    }
  }
}
</script>
